import React,{Component} from "react";
import PropTypes from 'prop-types'
import {Card,WingBlank,WhiteSpace} from "antd-mobile";
import {withRouter} from "react-router-dom";

import './userlist.css'
class UserList extends Component{
    static PropType={
        userlist:PropTypes.array.isRequired
    }
    render() {
        const {userlist} = this.props
        console.log("zheshilist",userlist)
        return(
            <div>
                {
                    userlist.map((user)=>(
                        <WingBlank key={user._id}>
                            {/*点击卡片跳转到聊条界面，可以回退*/}
                        <Card onClick={()=>this.props.history.push({
                            pathname:"/chat/"+user._id,
                            state:{user}
                        })} >
                            <Card.Header
                                title={user.username}
                                thumb={require("../../assets/headers/"+user.header+".png")}
                                extra={<span>{user.post}</span>}
                            />
                            <Card.Body>
                                <div className='userinfobar'>
                                <div className="brief">个人简介</div>
                                <div className="userinfo">{user.info}</div>
                                </div>
                            </Card.Body>
                            {

                                user.company?
                                    <Card.Footer content={<div>公司：{user.company}</div>} extra={<div>薪资：{user.salary}</div>} />
                                    :
                                    null
                            }

                        </Card>
                        <WhiteSpace/>
                        </WingBlank>
                    ))
                }
            </div>
        )
    }
}
export default withRouter(UserList)